<template>
  <div>
    <!-- 展示 header 组件内容 -->
    <Header />

    <!-- 路由组件展示的地方 -->
    <router-view></router-view>

    <!-- Footer 组件内容在 Home 与 Search 可见的，但是 Login 和 Register不可见
    利用路由元信息解决当前显示/隐藏为最优解 -->
    <Footer v-show="$route.meta.isShow" />
  </div>
</template>

<script>
//引入 Header 与 Footer 非路由组件
import Header from "./components/header/Header.vue";
import Footer from "./components/footer/Footer.vue";

export default {
  name: "App",
  // 注册组件（局部注册）
  components: {
    Header,
    Footer,
  },
  //组件挂载完成后，请求商品分类列表的接口
  mounted() {
    this.$store.dispatch("categoryList");
  },
};
</script>

<style>
</style>
